﻿@{
    ViewBag.Title = @SessionHelper.CurrentProduct.Name;
    Layout = "~/Views/Shared/_Layout4.cshtml";
}
@section head{
    <style type="text/css">
        ul > li
        {
            display: block;
            margin-top: 0.5em;
        }
        
        ul > li:first-child
        {
            margin-top: 0;
        }
        
        li > a.button
        {
            /*width: 190px;*/
            display: block;
        }
        
        body
        {
            overflow: auto;
        }
    </style>
    <script type="text/javascript">
        $(function () {
            $('#tabs').tabs();
            $('.button').button();
            $('.draggable').draggable({
                cursorAt: { top: -5, left: -5 },
                helper: function (event) {
                    console.log($(this));
                    var row = this;

                    return $('<div class="ui-widget-header"></div>').text("Move issue #" + $(this).closest('tr').attr('issue_id')).appendTo('body');
                }
            });
            $(".droppable").droppable({
                tolerance: "pointer",
                hoverClass: "ui-state-active",
                drop: function (event, ui) {
                    //$(this).addClass("ui-state-highlight").text("Dropped!");
                    console.log($(ui.draggable).closest('tr').attr('issue_id'), $(this).attr('sprint_id'));
                    var issueId = $(ui.draggable).closest('tr').attr('issue_id');
                    var sprintId = $(this).attr('sprint_id');
                    var updateUrl = '@(Url.Action("Update", "Stories", new { id = "issue_id" }))'.replace('issue_id', issueId);

                    $.ajax({
                        url: updateUrl,
                        type: 'POST',
                        dataType: 'json',
                        data: JSON.stringify({ SprintId: sprintId }),
                        contentType: 'application/json; charset=utf-8',
                        success: function (data) {
                            $(ui.draggable).fadeOut(function () {
                                $(this).closest('tr').remove();
                            });
                        }
                    });
                }
            });

            $('.expandable').click(function () {
                var row = $(this).closest('tr');
                $('<td></td>').text('html').attr('colspan', 8).appendTo('<tr></tr>').insertAfter(row);
            });

            $('.button[href^="@(Request.Url.AbsolutePath)"]').addClass('ui-state-highlight');
        });
    </script>
    @RenderSection("head", false)
}
<div style="width: 211px; float: left; margin: 0; margin-right: .5em;">
    <div class="ui-widget-header ui-corner-all">
        @ViewBag.Title @Html.ActionLink("edit", "Edit", "Products", new { @id = SessionHelper.CurrentProduct.ProductId }, new { style = "float: right;" })
    </div>
    <hr />
    <ul style="list-style-type: none; padding: 0; margin: 0;">
        <li>
            <a class="button" href="@Url.Action("backlog", "products", new { @id = SessionHelper.CurrentProduct.ProductId })">Backlog</a></li>
        <li>
            <li>
                Sprints <a href="@Url.Action("New", "Sprints", new { ProductId = SessionHelper.CurrentProduct.ProductId })" style="float: right;">add</a></li>
        </li>
        @foreach (var sprint in SessionHelper.CurrentProduct.Sprints.Where(s => (s.IsDeleted ?? false) != true).OrderByDescending(s => s.EndDate))
        {
            <li>
                <a class="button droppable" href="@Url.Action("stories", "sprints", new { @id = sprint.SprintId })" sprint_id="@sprint.SprintId">@sprint.Name</a></li>
        }
    </ul>
</div>
@RenderBody()
